HTMLWidgets.widget({

  name: 'mywidgetTest',

  type: 'output',

  factory: function(el, width, height) {

    // TODO: define shared variables for this instance

    return {


      renderValue: function(x) {

        // TODO: code to render the widget, e.g.
        // el.innerText = x.message;

        d3.select(el).append("svg")
        .attr("width", width)
        .attr("height", height);

        var svg = d3.select("svg");
        let myCx = x.myCx;

        // 绘制圆形
        svg.append("circle")
          .attr("cx", myCx)  // 圆心的x坐标
          .attr("cy", 100)  // 圆心的y坐标
          .attr("r", 50)    // 半径
          .style("fill", "steelblue");  // 填充颜色

      },

      resize: function(width, height) {

        // TODO: code to re-render the widget with a new size

      }

    };
  }
});
